<template>
  <div>
    <a-row type="flex" justify="space-around" align="top" :gutter="[8,16]" style="height: 626px">
      <!--计费规则模块表格-->
      <a-col :span="12">
        <a-row>
          <a-col :span="3">
            <a-button style="margin-left: 0px;margin-bottom:5px;float:left" @click="returnBack">返回</a-button>
          </a-col>
          <a-col :span="3">
            <a-button style="margin-bottom: 5px;margin-left: 0px;float:none" type="primary"
                      @click="addChargeRulesModule">
              新增计费时段
            </a-button>
          </a-col>
        </a-row>

        <a-row>
          <a-table
              ref="table"
              size="middle"
              bordered
              rowKey="id"
              :columns="chargeRulesModulesColumns"
              :dataSource="chargeRuleModules"
              :pagination="ipagination"
              :loading="confirmLoading"
              :customRow="chargeRuleModuleClick"
              @change="handleTableChange">
            <span slot="checkRadio" slot-scope="text,record">
                <a-radio @click="chargeRuleModuleCheck(record)" :checked="record.id===chargeRuleModule.id"></a-radio>
            </span>
            <span slot="carTypeId" slot-scope="text,record">
              {{ carTypeIdTrans(text) }}
            </span>
            <span slot="action" slot-scope="text,record">
              <a @click="chargeRuleModuleEdit(record)">编辑</a>
              <a-divider type="vertical"/>
              <a @click="chargeRuleModuleDelete(record)">删除</a>
            </span>
          </a-table>
        </a-row>
      </a-col>
      <a-divider type="vertical" style="margin-top: 45px;height: 570px;"></a-divider>
      <!--计费规则模块编辑区-->
      <a-col :span="11" style="padding-left: 0px;padding-right: 15px">
        <a-spin :spinning="loading">


          <a-row style="height: 37px">
            <p style="margin-top: 11px;margin-bottom: 5px;margin-left: 0px;float:none;font-size: 16px">
              计费段详情
            </p>
          </a-row>
          <a-row
              style="height: 570px;border-style: solid;border-width: 1px;border-color: #bbbbbb;padding: 0 10px;overflow-y: auto">
            <a-row type="flex" justify="end">
              <a style="margin-right: 10px" v-show="!(chargeRuleModule==={}||chargeRuleModule.id===undefined||chargeRuleModule.id === null)" @click="chargeRuleModuleSimpleEdit">修改</a>
            </a-row>
            <a-form style="margin-top: 5px" :form="chargeRulesModulesForm">
              <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                           label="计费类型">
                <a-select style="width: 340px" :disabled="isEdit" v-decorator="['chargeType',{initialValue:1}]"
                          :options="chargeTypeOption"
                          @change="getStepNumber"
                ></a-select>
              </a-form-item>

              <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                           label="时段起始时间">
                <a-time-picker :disabled="isEdit" style="width: 340px" :default-value="defaultStartTime" format="HH:mm"
                               v-model="startTime"
                               @change="startTimeChange"></a-time-picker>
              </a-form-item>
              <a-form-item v-show="false" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol" label="起始时间(小时)">
                <a-input v-decorator="['startTimeHour',{initialValue:0}]"></a-input>
              </a-form-item>
              <a-form-item v-show="false" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol" label="起始时间(分钟)">
                <a-input v-decorator="['startTimeMinute',{initialValue:0}]"></a-input>
              </a-form-item>
              <!--按次收费模块-->
              <div v-show="chargeRulesModulesForm.getFieldValue('chargeType')===1">
                <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                             label="计费金额">
                  <a-input-number :disabled="isEdit" style="width: 280px;" :min="0" :max="10000"
                                  v-decorator="['onceMoney',{initialValue:0}]">
                  </a-input-number>
                  &nbsp;&nbsp;元
                </a-form-item>
                <a-row type="flex" justify="center" style="margin-top: 20px;">
                  <a-button v-if="!isEdit" style="width: 100px" type="primary" @click="saveChargeRuleModule">
                    {{ saveContent }}
                  </a-button>
                </a-row>
              </div>
              <!--按时间增量收费模块-->
              <div v-show="chargeRulesModulesForm.getFieldValue('chargeType')===2">
                <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                             label="时段最高限额">
                  <a-input-number style="width: 180px" :disabled="isEdit"
                                  v-decorator="['rangeLimit',{initialValue:0}]"></a-input-number>
                  <a-checkbox :disabled="isEdit" style="margin-left: 5px" :checked="rangeLimitEnable===1"
                              @change="rangeLimitEnableChange">
                    启用最高限额
                  </a-checkbox>
                </a-form-item>

                <a-form-item class="chargeRulesModules" v-show="false" :labelCol="moduleLabelCol"
                             :wrapperCol="moduleWrapperCol" label="收费最高限额是否启用">
                  <a-input :disabled="isEdit" v-decorator="['rangeLimitEnable',{initialValue:1}]"></a-input>
                </a-form-item>
                <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                             label="不足时段计费规则" style="margin-bottom: 5px">
                  <a-select :disabled="isEdit" v-decorator="['notEnough',{initialValue:1}]"
                            :options="enoughTypeOption"></a-select>
                </a-form-item>
                <div style="border-style: solid;border-width: 1px;border-color: #bbbbbb;border-radius: 8px">
                  <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                               label="首计时单位(分钟)" style="margin-top: 5px">
                    <a-input-number :disabled="isEdit" style="width: 280px;" :min="0" :max="1440"
                                    v-decorator="['firstUnit',{initialValue:0}]"></a-input-number>
                    &nbsp;&nbsp;分钟
                  </a-form-item>
                  <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                               label="收费金额(元)" style="margin-bottom: 5px">
                    <a-input-number :disabled="isEdit" style="width: 280px;" :min="0" :max="10000"
                                    v-decorator="['firstMoney',{initialValue:0}]"></a-input-number>
                    &nbsp;&nbsp;元
                  </a-form-item>
                </div>
                <div
                    style="border-style: solid;border-width: 1px;border-color: #bbbbbb;margin-top: 10px;border-radius: 8px">
                  <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                               label="首计时后每(分钟)" style="margin-top: 5px">
                    <a-input-number :disabled="isEdit" style="width: 280px;" :min="0" :max="1440"
                                    v-decorator="['timeUnit',{initialValue:0}]"></a-input-number>
                    &nbsp;&nbsp;分钟
                  </a-form-item>
                  <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                               label="收费金额(元)" style="margin-bottom: 5px">
                    <a-input-number :disabled="isEdit" style="width: 280px;" :min="0" :max="10000"
                                    v-decorator="['moneyUnit',{initialValue:0}]"></a-input-number>
                    &nbsp;&nbsp;元
                  </a-form-item>
                </div>
                <a-row type="flex" justify="center" style="margin-top: 20px;">
                  <a-button v-if="!isEdit" style="width: 100px" type="primary" @click="saveChargeRuleModule">
                    {{ saveContent }}
                  </a-button>
                </a-row>
              </div>
              <!--按阶梯收费-->
              <div v-show="chargeRulesModulesForm.getFieldValue('chargeType')===3">
                <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                             label="时段最高限额">
                  <a-input-number style="width: 180px" :disabled="isEdit"
                                  v-decorator="['rangeLimit',{initialValue:0}]"></a-input-number>
                  <a-checkbox :disabled="isEdit" style="margin-left: 5px" :checked="rangeLimitEnable===1"
                              @change="rangeLimitEnableChange">
                    启用最高限额
                  </a-checkbox>
                </a-form-item>

                <a-form-item class="chargeRulesModules" v-show="false" :labelCol="moduleLabelCol"
                             :wrapperCol="moduleWrapperCol" label="收费最高限额是否启用">
                  <a-input :disabled="isEdit" v-decorator="['rangeLimitEnable',{initialValue:1}]"></a-input>
                </a-form-item>
                <a-form-item class="chargeRulesModules" :labelCol="moduleLabelCol" :wrapperCol="moduleWrapperCol"
                             label="分割计时单位">
                  <a-select :disabled="isEdit" v-decorator="['timeStepDivide',{initialValue:60}]" :options="stepDivides"
                            @select="getStepNumber">
                  </a-select>
                </a-form-item>
                <a-row v-if="chargeRulesModulesForm.getFieldValue('chargeType')===3">
                  <a-col style="margin-top: 10px" :span="8" align="end" v-for="{index,parkFee} in stepArray"
                         v-bind:key="stepArray.index">
                  <span v-if="chargeRulesModulesForm.getFieldValue('timeStepDivide')===60">
                  <span>{{ index + 1 }}</span>
                  </span>
                    <span v-else>
                    <span>{{ (index + 1) * 30 }}</span>
                  </span>
                    <span>{{ stepUnit() }}&nbsp;</span>
                    <a-input :disabled="isEdit" style="width: 80px" v-model="parkFee"
                             @change="stepMoneyEdit(index,parkFee)"></a-input>&nbsp;元
                  </a-col>
                </a-row>
                <a-row type="flex" justify="center" style="margin-top: 20px;margin-bottom: 20px">
                  <a-button v-if="!isEdit" style="width: 100px" type="primary" @click="saveChargeRuleModule">
                    {{ saveContent }}
                  </a-button>
                </a-row>
              </div>
            </a-form>
          </a-row>
        </a-spin>
      </a-col>
    </a-row>
  </div>
</template>

<script>
import {deleteAction, httpAction, postAction} from '@api/manage'
import pick from 'lodash.pick'
import moment from "moment"
import chargeRulesModal from "@views/area/chargeRules/modules/ChargeRulesModal";

export default {
  name: "ChargeRulesModuleModal",
  data() {
    return {
      title: "操作",
      visible: false,
      model: {},
      labelCol: {
        xs: {span: 24},
        sm: {span: 5},
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 16},
      },
      chargeRulesModulesForm: this.$form.createForm(this),
      moduleLabelCol: {
        xs: {span: 14},
        sm: {span: 7},
        style: 'textAlign:right'
      },
      moduleWrapperCol: {
        xs: {span: 28},
        sm: {span: 14},
        style: 'textAlign:left'
      },
      saveContent: '新增',
      chargeTypeOption: [{value: 1, label: '按次收费'}, {value: 2, label: '按时间量递增计费'}, {value: 3, label: '按时间阶梯计费'}],
      enoughTypeOption: [{value: 1, label: '不计费 '}, {value: 2, label: '本时段单位计时数加一'},{value: 3,label: '从下一时段补足'}],
      rangeLimitEnable: 1,
      defaultStartTime: moment('0:00', 'HH:mm'),
      startTime: moment('0:00', 'HH:mm'),
      selectedModuleId: [],
      chargeRulesModulesColumns: [
        {
          title: '选择',
          align: 'center',
          width: 48,
          dataIndex: 'checkRadio',
          scopedSlots: {customRender: 'checkRadio'},
        },
        {
          title: '计费类型',
          align: "center",
          dataIndex: 'chargeType',
          width: 100,
          customRender: function (t, r, index) {
            if (t === 1) {
              return '按次'
            }
            if (t === 2) {
              return '按时间增量'
            }
            if (t === 3) {
              return '按时间阶梯'
            }
          }
        },
        {
          title: '起始时间',
          align: "center",
          dataIndex: 'startTimeHour',
          width: 80,
          customRender: function (t, r, index) {
            let str = ''
            if (t < 10) {
              str = '0'
            }
            str = str + t + ':'
            if (r.startTimeMinute < 10) {
              str = str + '0'
            }
            str = str + r.startTimeMinute
            return str;
          }
        },
        {
          title: '结束时间',
          align: "center",
          dataIndex: 'endTimeHour',
          width: 80,
          customRender: function (t, r, index) {
            let str = ''
            if (t < 10) {
              str = '0'
            }
            str = str + t + ':'
            if (r.endTimeMinute < 10) {
              str = str + '0'
            }
            str = str + r.endTimeMinute
            return str;
          }
        },
        {
          title: "时段最高限额",
          align: "center",
          dataIndex: 'limitMoney',
          width: 100,
          customRender: function (t, r, index) {
            // 按次收费
            if (String(r.chargeType) === '1') {
              return r.onceMoney / 100;
            }
            // 按时段计费
            if (String(r.chargeType) === '2' || String(r.chargeType) === '3') {
              // 每日最高限额启用
              if (String(r.rangeLimitEnable) === '1') {
                return r.rangeLimit / 100;
              } else {
                return '-'
              }
            }
          }
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          width: 80,
          scopedSlots: {customRender: 'action'},
        }
      ],
      chargeRuleModules: [],
      chargeRuleModule: {},
      chargeRule: {},
      ipagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10'],
        showTotal: (total, range) => {
          return range[0] + "-" + range[1] + " 共" + total + "条"
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },
      confirmLoading: false,
      form: this.$form.createForm(this),
      validatorRules: {
        chargeRulesId: {rules: [{required: true, message: '请输入停车场计费规则id(对应charge_rules表主键id)!'}]},
      },
      url: {
        add: "/parking/chargeRulesModule/add",
        edit: "/parking/chargeRulesModule/edit",
        addChargeRuleModule: "/parking/chargeRulesModule/add",
        editChargeRuleModule: "/parking/chargeRulesModule/edit",
        getChargeRulesModules: '/parking/chargeRulesModule/getChargeRulesModules',
        chargeRuleModuleDelete: '/parking/chargeRulesModule/delete',
        getChargeSteps: '/parking/chargeRulesModule/getChargeSteps'
      },
      isEdit: true,
      loading: false,
      stepDivides: [{value: 30, label: 30}, {value: 60, label: 60}],
      moduleStepArray:[],
      stepArray: []
    }
  },
  watch: {},
  methods: {
    add() {
      this.edit({});
    },
    init(record) {
      this.chargeRule = record
      this.getChargeRulesModules();
    },
    getChargeRulesModules() {
      const that = this
      that.confirmLoading = true
      if (!this.url.getChargeRulesModules) {
        this.$message.error("请配置getChargeRulesModules")
        return
      }
      let params = {}
      params.chargeRulesId = that.chargeRule.id
      postAction(this.url.getChargeRulesModules, params).then(res => {
        if (res.success) {
          if (res.result) {
            that.chargeRuleModules = res.result
          }
        }
      })
      that.confirmLoading = false
    },
    startTimeChange(Format, time) {
      let timeArray = time.split(":")
      this.chargeRulesModulesForm.setFieldsValue({startTimeHour: timeArray[0]})
      this.chargeRulesModulesForm.setFieldsValue({startTimeMinute: timeArray[1]})
      this.getStepNumber()
    },
    getRangeTimeLength(hour, minute) {
      hour = Number(hour)
      minute = Number(minute)
      if (hour === this.chargeRuleModule.startTimeHour && minute === this.chargeRuleModule.startTimeMinute) {
        if (this.chargeRuleModule.endTimeHour !== null && this.chargeRuleModule.endTimeMinute !== null) {
          if (this.chargeRuleModule.endTimeHour === hour && this.chargeRuleModule.endTimeMinute === minute) {
            return 60 * 24
          }
          if (this.chargeRuleModule.endTimeHour > hour||(this.chargeRuleModule.endTimeHour===hour&&this.chargeRuleModule.endTimeMinute>minute) ) {
            return (this.chargeRuleModule.endTimeHour * 60 + this.chargeRuleModule.endTimeMinute) - (hour * 60 + minute)
          } else {
            return (this.chargeRuleModule.endTimeHour * 60 + this.chargeRuleModule.endTimeMinute) + (24 * 60) - (hour * 60 + minute)
          }
        }
        return
      }
      if (this.chargeRuleModules.length===0) {
        // 如果未配置计费规则，则区域长度为60*24分钟
        return 60 * 24
      } else {
        let index = 0;
        for (index; index < this.chargeRuleModules.length; index++) {
          let chargeRulesModule = this.chargeRuleModules[index]
          if (chargeRulesModule.id !== this.chargeRuleModule.id && String(chargeRulesModule.startTimeHour) === String(hour) && String(chargeRulesModule.startTimeMinute) === String(minute)) {
            this.$message.error("重复配置")
            return
          }
          if (chargeRulesModule.startTimeHour > hour || (chargeRulesModule.startTimeHour === hour&&chargeRulesModule.startTimeMinute>minute)) {
            let moduleTime = Number(chargeRulesModule.startTimeHour * 60) + Number(chargeRulesModule.startTimeMinute)
            let editModuleTime = (hour * 60) + minute
            return moduleTime - editModuleTime
          }
        }

        let module = this.getObject(this.chargeRuleModules[0])
        let moduleTime = Number(module.startTimeHour * 60) + Number(module.startTimeMinute)
        let oneDayTime = 24 * 60
        let editModuleTime = (hour * 60) + minute
        return moduleTime + oneDayTime - editModuleTime
      }
    },
    rangeLimitEnableChange() {
      if (this.rangeLimitEnable === 1) {
        this.rangeLimitEnable = 2
      } else {
        this.rangeLimitEnable = 1
      }
      this.chargeRulesModulesForm.setFieldsValue({rangeLimitEnable: this.rangeLimitEnable})
    },
    chargeRuleModuleEdit(record) {
      this.saveContent = '保存'
      this.isEdit = false
      this.chargeRuleModule = this.getObject(record)
      this.chargeRuleModule.onceMoney = this.chargeRuleModule.onceMoney / 100;
      this.chargeRuleModule.rangeLimit = this.chargeRuleModule.rangeLimit / 100;
      this.chargeRuleModule.firstMoney = this.chargeRuleModule.firstMoney / 100;
      this.chargeRuleModule.moneyUnit = this.chargeRuleModule.moneyUnit / 100;
      this.chargeRulesModulesForm.setFieldsValue(pick(this.chargeRuleModule, 'chargeType', 'startTimeHour', 'startTimeMinute', 'onceMoney', 'rangeLimit', 'rangeLimitEnable', 'firstUnit', 'firstMoney', 'timeUnit', 'moneyUnit', 'notEnough', 'timeStepDivide'))
      this.rangeLimitEnable = Number.parseInt(this.chargeRuleModule.rangeLimitEnable)
      this.startTime = moment(record.startTimeHour + ':' + record.startTimeMinute, 'HH:mm')

      if (this.chargeRuleModule.chargeType === 3) {
        //this.getStepNumber()
        this.getChargeSteps()
      }
    },
    carTypeIdTrans(text) {
      let label = text
      this.CarTypeSelectOption.forEach(carType => {
        if (text === carType.value) {
          label = carType.label
        }
      })
      return label
    },
    saveChargeRuleModule() {
      const that = this;
      // 触发表单验证
      this.chargeRulesModulesForm.validateFields((err, values) => {
        if (!err) {
          that.confirmLoading = true;
          let httpurl = '';
          let method = '';
          let formData = {};
          let chargeRulesModule = Object.assign(this.chargeRuleModule, values);
          chargeRulesModule.onceMoney = chargeRulesModule.onceMoney * 100
          chargeRulesModule.rangeLimit = chargeRulesModule.rangeLimit * 100
          chargeRulesModule.firstMoney = chargeRulesModule.firstMoney * 100
          chargeRulesModule.moneyUnit = chargeRulesModule.moneyUnit * 100
          chargeRulesModule.chargeRulesId = this.chargeRule.id
          if (this.chargeRuleModule.id === null || this.chargeRuleModule.id === undefined) {
            httpurl += this.url.addChargeRuleModule;
            method = 'post';
          } else {
            httpurl += this.url.editChargeRuleModule;
            method = 'post';
            chargeRulesModule.createUserId = this.chargeRuleModule.createUserId
            chargeRulesModule.createUserName = this.chargeRuleModule.createUserName
            chargeRulesModule.createTime = this.chargeRuleModule.createTime
          }
          formData.chargeRulesModule = chargeRulesModule
          let array = []
          this.stepArray.forEach((step)=>{
            let stepItem = that.getObject(step)
            stepItem.parkFee = stepItem.parkFee * 100
            array.push(stepItem)
          })
          formData.stepArray = array

          httpAction(httpurl, formData, method).then((res) => {
            if (res.success) {
              that.$message.success(res.result);
              that.$emit('ok');
              that.getChargeRulesModules()
              that.chargeRuleModuleReset()
            } else {
              that.$message.warning(res.message);
            }
            that.confirmLoading = false;
          })
        }
      })
    },
    handleTableChange(pagination, filters, sorter) {
      //分页、排序、筛选变化时触发
      //TODO 筛选
      if (Object.keys(sorter).length > 0) {
        this.isorter.column = sorter.field;
        this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
      }
      this.ipagination = pagination;
      this.getChargeRulesModules()
    },
    returnBack() {
      this.chargeRuleModuleReset()
      this.$emit("returnBack")
    },
    chargeRuleModuleReset() {
      this.chargeRuleModule = {}
      this.saveContent = "新增"
      this.startTime = this.defaultStartTime;
      this.rangeLimitEnable = 1
      this.isEdit = true
      this.chargeRulesModulesForm.resetFields();
    },
    chargeRuleModuleDelete(record) {
      const that = this
      if (!this.url.chargeRuleModuleDelete) {
        this.$message.error("请配置chargeRuleDelete")
        return
      }
      let params = {}
      params.id = record.id
      deleteAction(this.url.chargeRuleModuleDelete, params).then(res => {
        if (res.success) {
          this.$message.success(res.result)
          that.getChargeRulesModules()
        } else {
          this.$message.error(res.message)
        }
        this.chargeRuleModuleReset()
      })
    },
    edit(record) {
      this.form.resetFields();
      this.model = Object.assign({}, record);
      this.visible = true;
      this.$nextTick(() => {
        this.form.setFieldsValue(pick(this.model, 'chargeRulesId', 'chargeType', 'onceMoney', 'rangeLimit', 'rangeLimitEnable', 'firstUnit', 'firstMoney', 'timeUnit', 'moneyUnit', 'notEnough', 'goBeyond', 'createUserId', 'createUserName', 'updateUserId', 'updateUserName'))
        //时间格式化
        this.form.setFieldsValue({startTime: this.model.startTime ? moment(this.model.startTime) : null})
        this.form.setFieldsValue({endTime: this.model.endTime ? moment(this.model.endTime) : null})
        this.form.setFieldsValue({updateTime: this.model.updateTime ? moment(this.model.updateTime) : null})
      });
    },
    close() {
      this.$emit('close');
      this.visible = false;
    },
    handleCancel() {
      this.close()
    },
    getObject(object) {
      let ob = {}
      ob = Object.assign(ob, object)
      return ob
    },
    chargeRuleModuleCheck(record) {
      this.chargeRuleModuleReset()
      this.isEdit = true
      this.chargeRuleModule = this.getObject(record)
      this.chargeRuleModule.onceMoney = this.chargeRuleModule.onceMoney / 100;
      this.chargeRuleModule.rangeLimit = this.chargeRuleModule.rangeLimit / 100;
      this.chargeRuleModule.firstMoney = this.chargeRuleModule.firstMoney / 100;
      this.chargeRuleModule.moneyUnit = this.chargeRuleModule.moneyUnit / 100;
      this.chargeRulesModulesForm.setFieldsValue(pick(this.chargeRuleModule, 'chargeType', 'startTimeHour', 'startTimeMinute', 'onceMoney', 'rangeLimit', 'rangeLimitEnable', 'firstUnit', 'firstMoney', 'timeUnit', 'moneyUnit', 'notEnough', 'timeStepDivide'))
      this.rangeLimitEnable = Number.parseInt(this.chargeRuleModule.rangeLimitEnable)
      this.startTime = moment(record.startTimeHour + ':' + record.startTimeMinute, 'HH:mm')
      if (this.chargeRuleModule.chargeType === 3) {
        //this.getStepNumber()
        this.getChargeSteps()
      }
    },
    addChargeRulesModule() {
      this.chargeRuleModuleReset()
      this.isEdit = false
    },
    chargeRuleModuleClick: function (record, index) {
      let that = this
      return {
        on: {
          click: () => {
            if (that.chargeRuleModule.id === record.id) {
              return;
            }
            that.chargeRuleModuleCheck(record)
          }
        }
      }
    },
    chargeRuleModuleSimpleEdit() {
      this.saveContent = '保存'
      this.isEdit = false
    },
    getStepNumber(value) {
      let formChargeType = this.chargeRulesModulesForm.getFieldValue("chargeType")
      if(this.chargeRuleModule.id===null||this.chargeRuleModule.id===undefined)
      {
        if(String(formChargeType)==='3'||(String(formChargeType)!=='3'&&String(value)==='3'))
        {
          let stepDivide = this.chargeRulesModulesForm.getFieldValue("timeStepDivide");
          let startTimeHour = this.chargeRulesModulesForm.getFieldValue('startTimeHour')
          let startTimeMinute = this.chargeRulesModulesForm.getFieldValue('startTimeMinute')
          let timeLength = this.getRangeTimeLength(startTimeHour, startTimeMinute)
          let stepNumber = timeLength / stepDivide;
          this.stepArray = []
          for (let index = 0; index < stepNumber; index++) {
            this.stepArray.push({index: index, parkTime: (index + 1) * stepDivide, parkFee: 0})
          }
        }
      }else {
        if(this.chargeRuleModule.timeStepDivide===value)
        {
          this.getChargeSteps()
        }else {
          if(formChargeType===3)
          {
            let stepDivide = this.chargeRulesModulesForm.getFieldValue("timeStepDivide");
            let startTimeHour = this.chargeRulesModulesForm.getFieldValue('startTimeHour')
            let startTimeMinute = this.chargeRulesModulesForm.getFieldValue('startTimeMinute')
            let timeLength = this.getRangeTimeLength(startTimeHour, startTimeMinute)
            let stepNumber = timeLength / stepDivide;
            this.stepArray = []
            for (let index = 0; index < stepNumber; index++) {
              this.stepArray.push({index: index, parkTime: (index + 1) * stepDivide, parkFee: 0})
            }
          }
        }
      }
    },
    stepUnit() {
      let stepDivide = this.chargeRulesModulesForm.getFieldValue("timeStepDivide")
      if (String(stepDivide) === "30") {
        return '分钟金额'
      }
      if (String(stepDivide) === "60") {
        return '小时金额'
      }
    },
    getChargeSteps() {
      let params = {}
      params.id = this.chargeRuleModule.id
      const that = this
      this.loading = true
      postAction(this.url.getChargeSteps, params).then(res => {
        that.stepArray = []
        if (res.success) {
          let index = 0;
          res.result.forEach(step => {
            step.index = index
            step.parkFee = Number(step.parkFee / 100)
            that.stepArray.push(step)
            index++
          })
        }
        if(that.stepArray.length===0)
        {
          that.getStepNumber()
        }
        that.loading = false
      })
    },
    stepMoneyEdit(index, value) {
      this.stepArray[index].parkFee = value
    }
  }
}
</script>

<style lang="less" scoped>
/** Button按钮间距 */
.ant-btn {
  margin-left: 30px;
  margin-bottom: 30px;
  float: right;
}

/deep/ .ant-table-content {
  height: 523px;
}
</style>